<script setup>
import { ref, computed, onMounted } from 'vue'
import { useRouter } from 'vue-router'
// import { loginDialog } from '../loginDialog';

const active = ref(0)
const router = useRouter()

const list = ['home', 'mid', 'my']
const titles = ['首页', '心仪', '我的']

const title = computed(() => {
    return titles[active.value]
})

const handleChange = async (active) => {
    console.log(active);
    if (active !== 0) {
        // 判断有没有登录
        // const lo = await loginDialog(router)
        // if (!lo) {
            return false
        // }
    }
    router.replace({
        name: list[active],
    })
    return true
}
onMounted(() => {
    // 提取路由name
    const name = router.currentRoute.value.name
    console.log(name);

    active.value = list.indexOf(name)
})

</script>

<template>
    <router-view v-slot="{ Component }">
        <keep-alive>
            <component :is="Component" ref="mainContent" />
        </keep-alive>
    </router-view>
</template>